const webpack = require('webpack')
const path = require('node:path')
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const {merge} = require('webpack-merge');
const commonConfig = require('./webpack.common');

const Configuration = webpack.Configuration
/**
 * @type Configuration
 * 按需引入elementPlus 24789 ms
 * 45287 ms =>  加入include缩小范围25783 ms 23696 ms
 * 用cache 1098 ms
 */
const webpackConfig = merge(commonConfig, {
        mode: 'development',
        plugins: [
            // 提取css到link外链
            new MiniCssExtractPlugin({
                filename: '[name].css',
                chunkFilename: '[id].css'
            })
        ],
        // cache: {
        //     type: 'filesystem',
        //     allowCollectingMemory: true
        // },
        // https://www.webpackjs.com/configuration/dev-server/#devserver
        devServer: {
            static: path.join(__dirname, './public'),
            port: 9001,
            open: true,
            compress: true
        }
    }
)
module.exports = webpackConfig